<template>
	<view>
		<view class="top">
			<image :src="userDeatil.avat" mode=""></image>
			<view class="cont">
				<view class="warp">
					<text>{{userDeatil.userName}}</text>
					<image src="../../static/image/find.png" mode=""></image>
				</view>
				<text>{{userDeatil.account}}</text>
			</view>
		</view>
		<view class="nickName">
			<text>设置备注和标签</text>
			<text class="iconfont">&#xe74b;</text>
		</view>
		<view class="section">
			<view class="sign">
				<text>个性签名</text>
				<text>{{userDeatil.signature}}</text>
			</view>
			<view class="pyq">
				<text>朋友圈</text>
				<text class="iconfont">&#xe74b;</text>
			</view>
		</view>
		
		<view class="btn" @click="agree" v-if="userDeatil.state===0">
			通过验证
		</view>
		<view class="btn" @click="goChat(userDeatil.uuid)" v-else-if="userDeatil.state===1">
			发消息
		</view>
		<view class="btn" @click="goSaySomething" v-else>
			添加到通讯录
		</view>
	</view>
</template>

<script>
	import util from '../../utils/index.js'
	export default {
		data() {
			return {
				inviter: '',
				userDeatil:{}
			}
		},
		onLoad(option) {
			this.inviter = option.uuid
			let{uuid}=uni.getStorageSync('user')
			util.myRequest({
				url:'/getUserName/state',
				data:{
					uuid,
					other:option.uuid
				}
			}).then(res=>{
				this.userDeatil=res
			})
		},
		methods: {
			goSaySomething() {
				uni.navigateTo({
					url: '../saySomething/saySomething?inviter=' + this.inviter
				})
			},
			goChat(uuid){
				uni.navigateTo({
					url:'../chat/chat?uuid='+uuid
				})
			},
			agree(){
				let{uuid}=uni.getStorageSync('user')
				util.myRequest({
					url:'/addFriend/agree',
					data:{
						uuid,
						other:this.inviter
					}
				}).then(res=>{
					if(res.code==='001')uni.navigateTo({
						url:'../chat/chat?uuid='+this.inviter
					})
				})
			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #ededed;
	}

	.top {
		padding: 35upx 45upx;
		border: 1px solid #ccc;
		background-color: #fff;
		display: flex;

		image {
			width: 110upx;
			height: 110upx;
			border-radius: 10upx;
		}

		>.cont {
			display: flex;
			flex-direction: column;
			margin-left: 36upx;

			>.warp {
				font-size: 40upx;
				font-weight: 700;

				image {
					width: 25upx;
					height: 25upx;
					margin-left: 15upx;
				}
			}

			>text {
				font-size: 24upx;
				color: #999;
			}
		}
	}

	.nickName {
		font-size: 30upx;
		display: flex;
		justify-content: space-between;
		padding: 0 30upx;
		margin-bottom: 15upx;
		background-color: #fff;
		line-height: 100upx;

		>text:nth-last-child(1) {
			color: #999;
		}
	}

	.section {
		background-color: #fff;
		margin-bottom: 15upx;
		font-size: 30upx;

		>.sign {
			line-height: 123upx;
			padding-left: 27upx;
			border-bottom: 1px solid #ccc;

			>text:nth-child(2) {
				color: #999;
				margin-left: 38upx;
			}
		}

		>.pyq {
			line-height: 142upx;
			padding-left: 27upx;
			position: relative;

			>text:nth-child(2) {
				color: #999;
				position: absolute;
				top: 50%;
				transform: translateY(-50%);
				right: 27upx;
			}
		}
	}

	.btn {
		font-size: 27upx;
		color: #294477;
		text-align: center;
		line-height: 100upx;
		margin-bottom: 15upx;
		background-color: #fff;
	}
</style>
